<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<%@ page import="java.util.Date"%>
<% String formId = "form_" + new Date().getTime();
   String gridId = "grid_" + new Date().getTime();
   String path = request.getContextPath()+request.getServletPath().substring(0,request.getServletPath().lastIndexOf("/")+1);
%>
<script type="text/javascript" src="<%=request.getContextPath() %>/lib/uplodifyh5/event_common.js"></script>
<script type="text/javascript">

$(function (){
	var grid = $('[data-role="depGroupGrid"]');
    var form = $("[name='depGroupForm']");
	PageLoader = {
	   //
	    initSearchPanel:function(){
	        	            	                	            	                	            	                	            	                	            	        	     },
	    initGridPanel: function(){
	         var self = this;
	         var width = 152;
	         return grid.grid({
	                identity:"depGroupCode",
	                buttons: [
	                        {content: '<button class="btn btn-primary" type="button"><span class="glyphicon glyphicon-plus"><span>添加</button>', action: 'add'},
	                        {content: '<button class="btn btn-success" type="button"><span class="glyphicon glyphicon-edit"><span>修改</button>', action: 'modify'},
	                        {content: '<button class="btn btn-danger" type="button"><span class="glyphicon glyphicon-remove"><span>删除</button>', action: 'delete'},
	                        {content: '<button class="btn btn-success" type="button"><span class="glyphicon glyphicon-cloud-upload"><span>科室组数据导入</button>', action: 'dataImport'}
	                    ],
	                url:"${pageContext.request.contextPath}/DepGroup/pageJson.dhc",
	                columns: 
                	[
					 { title: '科室组显示顺序', name: 'depGroupOrder', width: width},
                	 { title: '科室组代码', name: 'depGroupCode', width: width},
                	 { title: '科室组名称', name: 'depGroupDesc', width: width},
     	             { title: '负责人', name: 'depgroupLeader', width: width},
     	             { title: '电话', name: 'depGroupPhone', width: width},
	                 { title: '操作', width: 130, render: function (rowdata, name, index)
	                     {
	                         var param = '"' + rowdata.depGroupCode + '"';
	                         var h = "<a href='javascript:openDepsPage(" + param + ")'>查看所辖科室</a> ";
	                         return h;
	                     }
	                 }
	                ]
	         }).on({
	                   'add': function(){
	                       self.add($(this));
	                   },
	                   'modify': function(event, data){
	                        var indexs = data.data;
	                        var $this = $(this);
	                        if(indexs.length == 0){
	                            drgUI.warning('请选择一条记录进行修改!');
	                            return;
	                        }
	                        if(indexs.length > 1){
	                             drgUI.warning('只能选择一条记录进行修改!');
	                            return;
	                        }
	                       self.modify(data.item[0],indexs[0], $this);
	                    },
	                   'delete': function(event, data){
	                        var indexs = data.data;
	                        var $this = $(this);
	                        if(indexs.length == 0){
	                            drgUI.warning('请选择要删除的记录!');
	                            return;
	                        }
	                        var remove = function(){
	                            self.remove(indexs, $this);
	                        };
	                        drgUI.confirm({
	                            content: '确定要删除所选记录吗?',
	                            callSure: remove
	                        });
	                   },
	                   'dataImport':function(){
	                	   self.dataImport($(this));
	                   }
	         });
	    },
	    add: function(grid){
	        var self = this;
	        var dialog = $('<div class="modal fade"><div class="modal-dialog">'
	        	+'<div class="modal-content"><div class="modal-header"><button type="button" class="close" '
	        	+'data-dismiss="modal" aria-hidden="true">&times;</button>'
	        	+'<h4 class="modal-title">新增</h4></div><div class="modal-body">'
	        	+'<p>One fine body&hellip;</p></div><div class="modal-footer">'
	        	+'<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>'
	        	+'<button type="button" class="btn btn-success" id="save">保存</button></div></div>'
	        	+'</div></div>');
	        $.get('<%=path%>/DepGroup-add.jsp').done(function(html){
	            dialog.modal({
	                keyboard:false
	            }).on({
	                'hidden.bs.modal': function(){
	                    $(this).remove();
	                }
	            }).find('.modal-body').html(html);
	            self.initPage(dialog.find('form'));
	        });
	        dialog.find('#save').on('click',{grid: grid}, function(e){
	              if(!Validator.Validate(dialog.find('form')[0],3))return;
	              var depGroupOrder = $("#depGroupOrderID").val();
	              $.post('${pageContext.request.contextPath}/DepGroup/isOrderExist.dhc',{'order':depGroupOrder}).done(function(result){
	            	  if(result){
	            		  drgUI.error('显示顺序已存在，请重新输入!');
	            	  }else{
	            		  $.post('${pageContext.request.contextPath}/DepGroup/add.dhc', dialog.find('form').serialize()).done(function(result){
		   	                   if(result.success ){
		   	                        dialog.modal('hide');
		   	                        e.data.grid.data('koala.grid').refresh();
		   	                    	 drgUI.success('保存成功!');
		   	                    }else{
		   	                     	drgUI.error('保存失败,'+result.errorMessage);
		   	                     }
		   	              	});
	            	  }
	              });
	        });
	    },
	    dataImport:function(grid){
	    	$('#uploadifive-depGroupImport input[type="file"]:last').click() ; 
	    },
	    modify: function(item,id, grid){
	        var self = this;
	        var dialog = $('<div class="modal fade"><div class="modal-dialog"><div class="modal-content"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button><h4 class="modal-title">修改</h4></div><div class="modal-body"><p>One fine body&hellip;</p></div><div class="modal-footer"><button type="button" class="btn btn-default" data-dismiss="modal">取消</button><button type="button" class="btn btn-success" id="save">保存</button></div></div></div></div>');
	        $.get('<%=path%>/DepGroup-update.jsp').done(function(html){
	               dialog.find('.modal-body').html(html);
	               self.initPage(dialog.find('form'));
	               
	               dialog.find("#depGroupOrderIDUpdate").val($.trim(item.depGroupOrder));
	               dialog.find("#depGroupDescIDUpdate").val(item.depGroupDesc);
	               dialog.find("#depgroupLeaderIDUpdate").val(item.depgroupLeader);
	               dialog.find("#depGroupPhoneIDUpdate").val(item.depGroupPhone);
	               
	                dialog.modal({
	                    keyboard:false
	                }).on({
	                    'hidden.bs.modal': function(){
	                        $(this).remove();
	                    }
	                });
	                dialog.find('#save').on('click',{grid: grid}, function(e){
	                    if(!Validator.Validate(dialog.find('form')[0],3))return;
	  	               var depGroupOrder = $("#depGroupOrderIDUpdate").val();
	  	              var depGroupCode = item.depGroupCode;
	  	              $.post('${pageContext.request.contextPath}/DepGroup/isOrderExist.dhc',{'order':depGroupOrder,'code':depGroupCode}).done(function(result){
	  	            	  if(result){
	  	            		 drgUI.error('显示顺序已存在，请重新输入!');
	  	            	  }else{
		  	            		$.post('${pageContext.request.contextPath}/DepGroup/update.dhc?depGroupCode='+id, dialog.find('form').serialize()).done(function(result){
			                        if(result.success){
			                            dialog.modal('hide');
			                            e.data.grid.data('koala.grid').refresh();
			                            drgUI.success('保存成功!');
			                        }else{
			                            drgUI.error(result.actionError);
			                        }
			                    });
	  	            	  }
	  	              }); 
	  	              
	                });
	        });
	    },
	    initPage: function(form){
	              form.find('.form_datetime').datetimepicker({
	                   language: 'zh-CN',
	                   format: "yyyy-mm-dd",
	                   autoclose: true,
	                   todayBtn: true,
	                   minView: 2,
	                   pickerPosition: 'bottom-left'
	               }).datetimepicker('setDate', new Date());//加载日期选择器
	               form.find('.select').each(function(){
	                    var select = $(this);
	                    var idAttr = select.attr('id');
	                    select.select({
	                        title: '请选择',
	                        contents: selectItems[idAttr]
	                    }).on('change', function(){
	                        form.find('#'+ idAttr + '_').val($(this).getValue());
	                    });
	               });
	    },
	    remove: function(ids, grid){
	    	var data = [{ name: 'depGroupCodes', value: ids.join(',') }];
	    	$.post('${pageContext.request.contextPath}/DepGroup/delete.dhc', data).done(function(result){
	                        if(result.success){
	                            grid.data('koala.grid').refresh();
	                            drgUI.success('删除成功!');
	                        }else{
	                            drgUI.error('请确保当前科室组不包含任何科室!');
	                        }
	    	});
	    }
	}
	PageLoader.initSearchPanel();
	PageLoader.initGridPanel();
	// 下载按钮
	var downloadBtn = '<div class="btn-clickable">' ;
	downloadBtn+='<a href="download/depGroup.xlsx" class="link text-sm" style = "text-decoration:none;color:#fff">' ;
	downloadBtn+='<i class="fa fa-download"></i>&nbsp;下载模版' ;
	downloadBtn+='</a>' ;
	downloadBtn+='</div>' ;
	$(<%=gridId%>).find("thead > tr > th").append(downloadBtn) ;
	
	$('#'+tabId+' #depGroupImport').uploadifive({
		'uploadScript' : contextPath + '/fileUpload/filesUpload.dhc',
        'height': 37,
        'width' :125,
        'auto'  : true,//是否自动开始
        'uploadLimit' : 100, //一次同步上传的文件数目     
        'fileSizeLimit' : '500MB', //单个文件大小，0为无限制，可接受KB,MB,GB等单位的字符串值     
        'queueSizeLimit' : 100, //队列中同时存在的文件个数限制
        'fileObjName':'file',
        'removeCompleted': true,  //是否完成后移除序列，默认为true
        'removeTimeout' : '5',  //上传完成后队列多长时间后消失。默认 3秒    需要：removeCompleted : true,时使用
        'progressData' :'percentage',//设置上传进度显示方式，percentage显示上传百分比，speed显示上传速度
        'buttonText' : '<i class="fa fa-folder-open fa-lg"></i>&nbsp;&nbsp;选择文件',
        'buttonClass': 'uploadifyH5_btn',
        'fileType' : '*.xls; *.xlsx; *.xml; *.dbf',//允许上传的文件格式
        'multi'    : true,//是否支持多文件上传
        'method'   :'post',//提交方式
        'debug':false,
        //当点击文件队列中文件的关闭按钮或点击取消上传时触发
        'onCancel': function(){ },
      	//返回一个错误，选择文件的时候触发  
        'onSelectError':  function() {
            drgUI.error('文件上传失败!');
        },
      	//检测FLASH失败调用  
        'onFallback':function() {
             drgUI.error('浏览器检测不到兼容版本的HTML5');
        }, 
        'onUpload': function(filesToUpload) {
        	$("#uploadifive-depGroupImport-queue").css("display","none") ;
        },
        'onUploadError' : uploadify_onUploadError,
        'onQueueComplete':function(queueData){
        	$.post(contextPath+'/fileUpload/depGroupImport.dhc').done(function(result){
        		if(result.hasErrors){
        			drgUI.alert(result.errorMessage,function(){
            			$('[data-role="depGroupGrid"]').grid('refresh');
            		});
        		}
        		else{
        			drgUI.alert(result.data,function(){
            			$('[data-role="depGroupGrid"]').grid('refresh');
            		});
        		}
        	});
        	/* closeBgDiv();
        	showBgDiv();//显示遮罩层 */
        }
    });
	$("#uploadifive-depGroupImport").css("display","none") ;
	form.find('#search').on('click', function(){
            if(!Validator.Validate(document.getElementById("<%=formId%>"),3))return;
            var params = {};
            form.find('input').each(function(){
                var $this = $(this);
                var name = $this.attr('name');
                if(name){
                    params[name] = $this.val();
                }
            });
            grid.getGrid().search(params);
        });
});

var openDepsPage = function(id){
        var dialog = $('<div class="modal fade"><div class="modal-dialog"><div class="modal-content"><div class="modal-header"><button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button><h4 class="modal-title">查看所辖科室</h4></div><div class="modal-body"><p>One fine body&hellip;</p></div><div class="modal-footer"><button type="button" class="btn btn-info" data-dismiss="modal">返回</button></div></div></div></div>');
        $.get('<%=path%>/DepGroup-view.jsp').done(function(html){
               dialog.find('.modal-body').html(html);
               $.get( '${pageContext.request.contextPath}/DepGroup/get/' + id + '.dhc').done(function(json){
                       json = json.data;
                       if(json =="")
                       	json="无";
                       dialog.find('#DepInfoID').html(json);
               });
                dialog.modal({
                    keyboard:false
                }).on({
                    'hidden.bs.modal': function(){
                        $(this).remove();
                    }
                });
        });
}
</script>
</head>
<body>
<div style="width:98%;margin-right:auto; margin-left:auto; padding-top: 15px;">
<!-- search form -->
<%-- <form name="depGroupForm" id=<%=formId%> target="_self" class="form-horizontal">
<table border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>
    	<div class="form-group">
    		<label class="control-label" style="width:100px;float:left;">科室组名称:&nbsp;</label>
            <div style="margin-left:15px;float:left;">
            	<input name="depGroupDesc" class="form-control" type="text" style="width:180px;" id="depGroupDescID"  />
			</div>
            <label class="control-label" style="width:100px;float:left;">负责人:&nbsp;</label>
            <div style="margin-left:15px;float:left;">
            	<input name="depgroupLeader" class="form-control" type="text" style="width:180px;" id="depgroupLeaderID"  />
        	</div>
        	<label class="control-label" style="width:100px;float:left;">电话:&nbsp;</label>
            <div style="margin-left:15px;float:left;">
	            <input name="depGroupPhone" class="form-control" type="text" style="width:180px;" id="depGroupPhoneID"  />
	        </div>
		</div>
	</td>
	<td style="vertical-align: bottom;"><button id="search" type="button" style="position:relative; margin-left:35px; top: -15px" class="btn btn-primary"><span class="glyphicon glyphicon-search"></span>&nbsp;查询</button></td>
  </tr>
</table>	
</form> --%>
<form role="form" name="depGroupForm" id=<%=formId%> target="_self" class="form-horizontal">
	<div class="form-group col-md-3">
		<label for="depGroupDesc" style="width: 80px;">科室组名称:</label>
        <input name="depGroupDesc" class="form-control" type="text" style="width:180px;" id="depGroupDescID"  />
	</div>
	<div class="form-group col-md-3">
		<label for="depgroupLeader" style="width: 80px;">负责人:</label>
        <input name="depgroupLeader" class="form-control" type="text" style="width:180px;" id="depgroupLeaderID"  />
	</div>
	<div class="form-group col-md-3">
		<label for="depGroupPhone" style="width: 80px;">电话:</label>
        <input name="depGroupPhone" class="form-control" type="text" style="width:180px;" id="depGroupPhoneID"  />
	</div>
	<div class="form-group col-md-1" >
		<button id="search" type="button"  class="btn btn-primary"><span class="glyphicon glyphicon-search"></span>&nbsp;查询</button>
	</div>
</form>
<div><input id="depGroupImport" type="file" name="depGroupImport" style="display: none;"/></div>
<!-- grid -->
<div data-role="depGroupGrid" id=<%=gridId%>></div>
</div>
</body>
</html>
